<?php if(!defined('IN_FIRADIO')) {header('HTTP/1.1 403 Forbidden');exit('<h1>Access Denied</h1>');}?>
<?php $GLOBALS['script'][] = function() {?><script>
vue.data.disabled = false;
vue.data.form.useragent = '';
vue.data.apidata = {};
vue.methods.submit_detector = function () {
    const that = this;
    if (that.form.useragent === '') {
        alert('请输入您要查询的UA');
        return;
    }
    //that.disabled = true;
    var url = '/panel/ua/detector.php';
    url = '/';
    that.ApiPost(url, that.form, {
        baseURL: 'http://192.168.100.32:8001'
    }).then(function (data) {
        vue.data.apidata = data.data;
        //form.useragent = '';
    }, function (data) {
    });
};
vue.methods.getTitle = function (name) {
    const title = {};
    title['device'] = '设备';
    title['os'] = '系统';
    title['engine'] = '引擎';
    title['browser'] = '浏览器';
    title['lang'] = '语言';
    if (title.hasOwnProperty(name)) {
        return title[name];
    }
    return name;
};
vue.mounted = function () {
};
</script><?php }?>

<!-- Custom Tabs -->
<form v-on:submit="submit_detector" onsubmit="return false" :disabled="disabled">
<div class="nav-tabs-custom">

    <div style="padding: 10px;">
        查询UA
        <input v-model="form.useragent" style="width: 80%" />
        <button style="font-size: 14px;" class="btn btn-default btn-xs">解析</button>
    </div>

    <table
    v-if="apidata.detector"
    class="table table-bordered table-striped dataTable">
        <tr align="center">
            <td colspan="4">
                <div class="pull-left header">
                    <i class="fa fa-th"></i>
                    <font>解析结果</font>
                </div>
            </td>
        </tr>
        <tr align="center">
            <td>类型</td>
            <td>名称</td>
            <td>版本号</td>
            <td>完整版本</td>
        </tr>
        <tr align="center" v-for="(detector,ua_class) in apidata.detector">
            <td>{{getTitle(ua_class)}}</td>
            <td>
                <span v-if="detector.title">{{detector.title}}</span>
                <span v-else>{{detector.name}}</span>
            </td>
            <td>{{detector.version}}</td>
            <td>{{detector.fullVersion}}</td>
        </tr>
    </table>


</div>
</form>
